<template>
	<view>
		<view class="time">
			<view class="dateTime">日期选择:</view>
			<view class="">
				<DyDate placeholder="起始日期" :childValue="from" :minSelect="from_minSelect" :maxSelect="from_maxSelect" :iconshow="false"
				 @getData="getFromData"></DyDate>
			</view>
			<view class="dateTime">——</view>
			<view class="">
				<DyDate placeholder="结束日期" :minSelect="to_minSelect" :childValue="to" :maxSelect="to_maxSelect" :iconshow="false"
				 @getData="getToData"></DyDate>
			</view>
		</view>
		<view class="uni-padding-wrap uni-common-mt">
			<button type="primary" @click="query">查询</button>
		</view>
		<view class="uni-form-item uni-column uni-center" v-if="!FormData">
			<view class="title">没有信息</view>
		</view>
		<view class="box" v-for="(item, index) in FormData" :key="index">
			<view class="name">客户名称: {{item.NAME}}</view>
			<!-- <view class="shuangb"><text>存款金额: {{item.invoice_status1}}</text><text>期限: {{item.pay_amount}}月</text></view> -->
			<view class="name color">存款总额: {{item.sum}}</view>
			<view class="cent"><text class="bdfw" @click="draw(item.ID)">查看客户明细</text></view>
		</view>
	</view>
</template>

<script>
	import DyDate from '@/components/dy-Date/dy-Date.vue'
	export default {
		components: {
			DyDate
		},
		data() {
			return {
				title: "请选择时间",
				FormData: [{
					order_no: 11,
					user_name: 'ff',
					pay_no: 111,
					invoice_status1: 11,
					pay_amount: 22,
					totalSum: 111
				}],
				from_minSelect: '1900/01/01',
				from_maxSelect: '2050/12/31',
				to_minSelect: '1900/01/01',
				to_maxSelect: '2050/12/31',
				from: '',
				to: '',
			}
		},
		mounted() {
			let params = {
				page: 1,
				limit: 10,
				timea: this.getNowFormatDate(),
				timeb: this.getNowFormatDate()
			};
			this.to = this.getNowFormatDate()
			this.from = this.getNowFormatDate()
			this.init(params);
		},
		methods: {
			init(params) {
				params.ygId = uni.getStorageSync('user').id
				this.$api.getCkT1(params).then((res) => {
					if (res.rows.length == 0) {
						this.FormData = ''
						return
					}
					this.FormData = res.rows
				}).catch((err) => {
					console.log('request fail', err);
				})
			},
			getNowFormatDate() {
				let date = new Date();
				let seperator1 = "-";
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let strDate = date.getDate();
				if (month >= 1 && month <= 9) {
					month = "0" + month;
				}
				if (strDate >= 0 && strDate <= 9) {
					strDate = "0" + strDate;
				}
				let currentdate = year + seperator1 + month + seperator1 + strDate;
				return currentdate;
			},
			getToData(time) {
				this.from_maxSelect = time
				this.to = time
				console.log(this.to, this.from_maxSelect)
			},
			getFromData(time) {
				this.to_minSelect = time
				this.from = time
				console.log(this.from, this.to_minSelect)
			},
			query() {
				let params = {
					page: 1,
					limit: 10,
					timea: this.from,
					timeb: this.to
				}
				this.init(params);
			},
			draw(id) {
				uni.navigateTo({
					url: '../extension/extensionInfo?id=' + id
				});
			}
		}
	}
</script>

<style scoped>
	.box {
		background: #F8F8FF;
		margin: 10px;
		border-radius: 10px;
		padding: 10px;
		line-height: 24px;
	}

	.name {
		font-weight: bold;
		font-size: 16px;
	}

	.color {
		color: red;
	}

	.shuangb {
		display: flex;
		justify-content: space-between;
	}

	.cent {
		display: flex;
		justify-content: center;
	}

	.bdfw {
		background: #007AFF;
		display: block;
		width: 100px;
		text-align: center;
		border-radius: 10px;
		color: #fff;
	}

	.time {
		display: flex;
	}

	.dateTime {
		height: 24px;
		padding: 7px 12px;
		line-height: 24px;
	}
</style>
